<template>
  <div class="reuse-dom">
    <!-- <el-button type="primary" v-if="visible">我是按钮</el-button>
    <el-link type="primary" v-else>我是超链接</el-link> -->

    <el-button type="primary" v-show="visible">我是按钮</el-button>
    <el-link type="primary" v-show="!visible">我是超链接</el-link>

    <div v-show="visible">
      <!-- 调用AAA组件 -->
    </div>
    <div v-show="!visible">
      <!-- 调用AAA组件-->
    </div>
    <br /><br />
    <a href="#">测试</a>
  </div>
</template>

<script>
export default {
  name: 'reuse-dom',
  data() {
    return {
      visible: false
    }
  },
  mounted() {
    setTimeout(() => {
      this.visible = true
    }, 2000)
  }
}
</script>

<style lang="less" scoped>
.el-button {
  border-radius: 0;
}
</style>
